iT邦幫忙

2021 iThome 鐵人賽

DAY 18
0

來找設計師一起 side project,前後端 / UIUX 皆可ㄛ。配對單連結:
https://docs.google.com/spreadsheets/d/1-6YCUfqaB7dQLQa34pbuCHgYvXU3eYZ0dvDcPszhE4g/edit?usp=sharing


印度氣象局官網:https://mausam.imd.gov.in/#.

prototype 大家自己玩玩看,應該會每天更新ㄅ:
https://xd.adobe.com/view/bd7fd57a-8e2f-44b0-bc26-322e98708133-e82c/


哈囉大家晚安,今天居然差點忘記寫鐵人賽,嚇死我,趕快將我的印度氣象局拿出來弄點顏色。

上次的 wireframe 可以自己去看前一篇,大抵來說就是黑白的線稿。
所以呢,我們就今天要來配一點顏色給他,讓他 blingbling 。
然後設計感啥的絕不可能,就別想太多,我覺得這種資訊型網站簡單明瞭就很好了。

主色

我只選了三個顏色,重藍色、淺藍色、黃色,頂多加上紅色的警告 icon,不過主要就是 3 個為主。黃+藍我覺得是一個非常適合科技業的配色,會顯示出精緻高級但又充滿科技感。

(ps. 你看到的所有色票是本來官網的所有顏色)

藍為主,配點黃色

所以當他 hover 的時候就會是出現黃色了,啊啊好美,但我沒有每個按鈕都做,太累了嗚嗚。

加上黃色輔色給他一點表頭設計看起來就完美多了

大城市+自訂天氣+新聞區塊

大城市天氣的這一塊是用淡藍色的底,底是使用次要的藍色降低透明度,重藍色去壓。

然後去 YouTube 截了一張他們的可愛播報員,做了一個按鈕給他播報。

底下新聞就隨意了,從好用的圖庫網站找了 4 張印度的圖片。

https://o-dan.net/en/

加上天氣標示

搞定nav sidebar同時順便給這個地圖加上昨天懶得加的天氣標示。

LOGO 部分

我選擇了氣象局原本的Logo,他的另外一個Logo其實是印度,那個我應該會放在 footer 或是直接拿掉。

他原本的設計是長這樣,但看起來有點侷促,所以我這樣他上面的那部分放到旁邊,然後把它塞回去。

應該是可以重新設計啦但我很懶

整體

今天大概這樣子,明天請了一天特休要來開開心心的搞履歷了。

最近好多人要離職,報復離職潮嗎,好害怕。


上一篇
Day 17 淘家集運 插畫分享
下一篇
Day 19 民生公共物聯網資料應用競賽,產品設計討論過程分享
系列文
30 天重新設計印度氣象局官網首頁22
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言